<template>
  <div class="registerPage">
    <van-nav-bar title="面经注册" />
    <van-form @submit="onSubmit">
      <van-field
        v-model="username"
        name="username"
        label="用户名"
        placeholder="用户名"
        :rules="[{ required: true, message: '请填写用户名' }]"
      />
      <van-field
        v-model="password"
        type="password"
        name="password"
        label="密码"
        placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
      <div style="margin: 16px">
        <van-button
          style="background-color: #fa6d1d; border: none"
          block
          type="info"
          native-type="submit"
          >注册账号</van-button
        >
      </div>
    </van-form>

    <div style="text-align: right; padding-right: 20px">
      <router-link to="/login" style="color: #116d9b"
        >已有账号去登录</router-link
      >
    </div>
  </div>
</template>
<script>

// import { Toast } from 'vant';
import {registerApi} from '../api/user'
export default {
  data () {
    return {
      username: '',
      password: '',
    };
  },
  methods: {
    // 监听表单的提交，形参中：可以获取到输入框的值得到的是一个对象values:{用户名: '18672776151', 密码: '18672776151'}
    async onSubmit (values) {
      console.log('submit', values);
   const res= await registerApi(values)
   
      // this.$toast({
      //   message: '注册成功',
      //   position: 'bottom',
      // });
      this.$toast('注册成功')
      this.$router.push('/login')
    },
  },
};
</script>
<style lang='less'  scoped>
</style>
